<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<f:view locale="#{languageBean.locale}" />
<h:head>
	<link type="text/css" rel="stylesheet" href="../css/dth.css" />
	<script src="jquery-1.10.2.min.js"></script>
	<script>
		$(document).ready(function() {
			$(".menu_item").hover(function() {
				$(this).addClass("menu_hover");
			});
			$(".menu_item").mouseleave(function() {
				$(this).removeClass("menu_hover");
			});

		});
	</script>
	<style>
.ui-widget-header a {
	color: #FFFFFF !important;
}

.dropdown-menu {
	padding: 0;
	margin: 0;
	width: 120px;
	font-family: Arial;
	display: inline-table;
	position: relative;
	border-bottom-style: none;
}

.dropdown-menu .menu-item {
	background-color: #2AA5E8;
	display: none;
}

.dropdown-menu .menu-item-link {
	display: table-cell;
	text-decoration: none;
	color: rgba(89, 87, 87, 0.9);
	height: 30px;
	padding: 5px;
	vertical-align: middle;
	cursor: pointer;
}

.dropdown-menu:hover .menu-item {
	border-bottom-style: solid;
}

.dropdown-menu .menu-item-link:hover {
	background-color: #DDDDDD;
}

.dropdown-menu:hover .menu-item {
	display: table-row;
}

.dropdown-menu .menu-item.active {
	display: table-header-group;
	background: none;
}

.dropdown-menu .menu-item.active .menu-item-link:after {
	width: 0;
	height: 0;
	content: "";
	position: absolute;
	top: 12px;
	right: 8px;
	border-top: 4px solid rgba(0, 0, 0, 1);
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}

.login {
	background: none repeat scroll 0 0 #0F4069;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	color: #FFFFFF;
	float: right;
	font-size: 16px;
	font-weight: bold;
	height: 50px;
	line-height: 34px;
	text-align: center;
	width: 93px;
}

.user_login {
	background: none repeat scroll 0 0 #0F4069;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	color: #FFFFFF;
	float: left;
	font-size: 16px;
	font-weight: bold;
	height: 37px;
	line-height: 34px;
	margin-right: 12px;
	text-align: center;
	width: 190px;
}

.menu {
	height: 244px;
	margin: -19px auto 0;
	position: relative;
	width: 1200px;
}

.menu_item {
	border-right: 1px solid #FFFFFF;
	float: left;
	font-weight: 800 !important;
	height: 110%;
	padding-top: 1%;
	width: 10%;
}

.menu_hover {
	box-shadow: 6px 11px 10px;
}
}
</style>
</h:head>
<h:body>
	<div class="dth_header_home">
		<p:panel style="display:none;"></p:panel>
		<div
			style="width: 100%; height: 5px; float: left; background: #0F4069;">

		</div>
		<div style="width: 100%; height: 30%; float: left;">
			<div style="text-align: center;">

				<div class="menu">
					<div style="width: 400px; height: 195px; float: left;">
						<img style="float: left; margin-top: 21px;" src="images/logo.png"
							title="Edit" />
					</div>
					<div style="width: 100%; height: 30px; float: left;">
						<div class="menu_item menu1">
							<h:outputLink value="welcome.xhtml"
								style="text-decoration: none !important;color:#0F4069 !important;">
								<h:outputText value="#{msg['menu_home']}" />
							</h:outputLink>
						</div>
						<div class="menu_item menu2">
							<h:outputLink value="package_home.xhtml"
								style="text-decoration: none !important;color:#0F4069 !important;">
								<h:outputText value="#{msg['menu_package']}" />
							</h:outputLink>
						</div>
						<div class="menu_item menu3">
							<h:outputLink value="setupbox_order_home.xhtml"
								style="text-decoration: none !important;color:#0F4069 !important;">
								<h:outputText value="#{msg['menu_cost']}" />
							</h:outputLink>
						</div>

						<div class="menu_item menu4">
							<h:outputLink value="recharge_home.xhtml"
								style="text-decoration: none !important;color:#0F4069 !important;">
								<h:outputText value="#{msg['menu_recharge']}" />
							</h:outputLink>
						</div>
						<div class="menu_item menu5">
							<h:outputLink value="faq_home.xhtml"
								style="text-decoration: none !important;color:#0F4069 !important;">
								<h:outputText value="#{msg['menu_faq']}" />
							</h:outputLink>
						</div>
						<div class="menu_item menu6">
							<h:outputLink value="movie_home.xhtml"
								style="text-decoration: none !important;color:#0F4069 !important;">
								<h:outputText value="#{msg['menu_admin_movie']}" />
							</h:outputLink>
						</div>
						<h:panelGroup rendered="#{loginBean.role==4}">
							<div class="menu_item menu6">
								<h:outputLink value="feedback_home.xhtml"
									style="text-decoration: none !important;color:#0F4069 !important;">
									<h:outputText value="Feedback" />
								</h:outputLink>
							</div>
						</h:panelGroup>
						<div class="menu_item menu6">
							<ul class="dropdown-menu" style="z-index: 2">
								<li class="menu-item"><a href="aboutus_home.xhtml" class="menu-item-link">
										<h:outputText value="#{msg['menu_admin_contact']}"></h:outputText>
								</a></li>
								<li class="menu-item"><a href="dealer_home.xhtml" class="menu-item-link">
										<h:outputText value="#{msg['menu_admin_dealer']}"></h:outputText>
								</a></li>
								<li class="active menu-item" style="height: 33px"><h:outputLink
										value="aboutus_home.xhtml"
										style="text-decoration: none !important;color:#0F4069 !important;">
										<h:outputText value="#{msg['menu_about']}" />
									</h:outputLink></li>
							</ul>

						</div>

						<h:panelGroup rendered="#{loginBean.role==1}">
							<div class="menu_item menu7">
								<h:outputLink value="package.xhtml"
									style="text-decoration: none !important;color:#0F4069 !important;">
									<h:outputText value="#{msg['menu_admin']}" />
								</h:outputLink>
							</div>
						</h:panelGroup>
					</div>


				</div>
			</div>
			<div
				style="float: right; height: 44px; margin-top: -226px; width: 1600px;">

				<h:form>
					<h:selectOneMenu style="float:right;margin-left:30px;"
						value="#{languageBean.localeCode}" onchange="submit()"
						valueChangeListener="#{languageBean.changeLocale}">
						<f:selectItem itemLabel="English" itemValue="1"></f:selectItem>
						<f:selectItem itemLabel="VietNamese" itemValue="2"></f:selectItem>
					</h:selectOneMenu>
				</h:form>
				<h:panelGroup rendered="#{loginBean.logined==true}">
					<h:form>
						<div class="login">
							<h:outputLink
								style="text-decoration: none !important;color:#ffffff !important;"
								rendered="#{loginBean.logined==true}" value="login.xhtml">
								<h:outputText value="#{msg['menu_logout']}"></h:outputText>
								<p:ajax event="click" listener="#{loginBean.logOut}"></p:ajax>
							</h:outputLink>

						</div>
						<h:panelGroup rendered="#{loginBean.role==4}">
							<div class="user_login">
								<h:outputLabel value="#{msg['user']}: "></h:outputLabel>
								<h:outputLink value="user_profile.xhtml"
									style="text-decoration: none !important;color:#ffffff !important;">
									<h:outputFormat value="#{loginBean.userName}"></h:outputFormat>
								</h:outputLink>
							</div>
						</h:panelGroup>
						<h:panelGroup rendered="#{loginBean.role==1}">
							<div class="user_login">
								<h:outputLabel value="#{msg['user']}: "></h:outputLabel>
								<h:outputLink value="admin_profile.xhtml"
									style="text-decoration: none !important;color:#ffffff !important;">
									<h:outputFormat value="#{loginBean.userName}"></h:outputFormat>
								</h:outputLink>
							</div>
						</h:panelGroup>
						<h:panelGroup rendered="#{loginBean.role==2}">
							<div class="user_login">
								<h:outputLabel value="#{msg['user']}: "></h:outputLabel>
								<h:outputLink value="dealer_profile.xhtml"
									style="text-decoration: none !important;color:#ffffff !important;">
									<h:outputFormat value="#{loginBean.userName}"></h:outputFormat>
								</h:outputLink>
							</div>
						</h:panelGroup>
						<h:panelGroup rendered="#{loginBean.role==3}">
							<div class="user_login">
								<h:outputLabel value="#{msg['user']}: "></h:outputLabel>
								<h:outputLink value="distributor_profile.xhtml"
									style="text-decoration: none !important;color:#ffffff !important;">
									<h:outputFormat value="#{loginBean.userName}"></h:outputFormat>
								</h:outputLink>
							</div>
						</h:panelGroup>
					</h:form>
				</h:panelGroup>
				<h:panelGroup rendered="#{loginBean.logined==false}">

					<h:outputLink
						style="text-decoration: none !important;color:#ffffff !important;"
						value="login.xhtml">
						<div class="login"><h:outputText value="#{msg['menu_login']}"></h:outputText></div>
					</h:outputLink>
				</h:panelGroup>
			</div>
		</div>

	</div>

</h:body>
</html>